<template>
  <div class="companyName">
    <el-autocomplete :placeholder="placeholder" style="width:290px;"
                     :debounce="0" :fetch-suggestions="querySearch2" @select="handleSelect($event)"
                     @keydown.native="keydown($event)"
                     :trigger-on-focus="true"
                     v-model="inputName"
                     clearable
    >
      <template slot-scope="{ item }">
        <section class="querySearch-autocomplete">
          <section class="name-item">
            <section class="name"><span v-if="item.id">{{ item.names.substr(0, 1) }}</span></section>
            {{ item.names }}
          </section>
          <section>
          </section>
        </section>
        <div></div>
      </template>
    </el-autocomplete>
  </div>
</template>

<script>
import {getWindowList, dynamicWindowList} from '@/api/market/crm.js'

export default {
  data() {
    return {
      inputName: '',
      title: '选择客户',
      page:{
      	pageNo:1,
      	pageSize:5
      }
    }
  },
  props: ['placeholder', 'dataItem'],
  methods: {
    keydown(e) {
      if (e.keyCode === 32) {
        e.returnValue = false
      }
    },
    // 操作点击选择搜索到的数据可以不要
    handleSelect($event) {
      this.inputName = $event.names
      this.$emit('getCompanyData', $event)
    },
    // 点击树获取列表和搜索获取列表
    querySearch2(queryString, cb) {
      // 判断调用接口itemType
      // 调用 callback 返回建议列表的数据
      if (this.dataItem.itemType === 2) {
        // 走后台 sql 查询数据
        dynamicWindowList({
          keySQL: this.dataItem.itemDictCode
        }).then((res) => {
          // this.newData = res.data.result.dataList
          // this.newDataPage.total = this.newData.length
          // this.handleNewCurrentChange()
          // this.tabLoading = false
          if (res.data.code === '200') {
            this.values = []
            for (let index = 0; index < res.data.result.dataList.length; index++) {
              let element = {
                id: res.data.result.dataList[index].id,
                names: res.data.result.dataList[index].name
              }
              this.values.push(element)
            }
            cb(this.values)// 返回搜索下拉框里面数据
          }
        })
      } else {
        getWindowList({ // 后台地址
          state: 1,
          // pageSize: params.pageSize,
          pageSize: -1,  // -1 不分页
//					pageSize: this.page.pageSize,  // -1 不分页
//        pageNo: this.page.pageNo,
          names: queryString
        }).then((res) => {
          if (res.data.code == 200) {
            this.values = []
            for (let index = 0; index < res.data.result.list.length; index++) {
              let element = {
                id: res.data.result.list[index].id,
                names: res.data.result.list[index].names
              }
              this.values.push(element)
            }
            cb(this.values)// 返回搜索下拉框里面数据
          }
        })
      }
    }
  },

}
</script>

<style scoped lang="less">
.companyName {
  margin-right: 59px;
}
</style>
